<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      const constantRoutes = [
        {
          path: '/login',
          name: 'login',
          component: () => import('@/views/login'),
          hidden: true
        },
        {
          path: '/',
          name: '/',
          component: () => import('@/layout'),
          redirect: '/users',
          children: [
            {
              path: 'users',
              name: 'users',
              component: () => import('@/views/users/index.vue'),
              hidden: true
            },
            {
              path: 'categories',
              name: 'categories',
              component: () => import('@/views/categories/index.vue')
            },
            {
              path: 'goods',
              name: 'goods',
              component: () => import('@/views/goods/index.vue')
            },
            {
              path: 'orders',
              name: 'orders',
              component: () => import('@/views/orders/index.vue')
            },
            {
              path: 'params',
              name: 'params',
              component: () => import('@/views/params/index.vue')
            },
            {
              path: 'reports',
              name: 'reports',
              component: () => import('@/views/reports/index.vue')
            },
            {
              path: 'rights',
              name: 'rights',
              component: () => import('@/views/rights/index.vue')
            },
            {
              path: 'roles',
              name: 'roles',
              component: () => import('@/views/roles/index.vue')
            }
          ]
        }
      ]

      const userMenuList = [
        {
          path: 'acl',
          name: 'acl',
          component: 'asdf'
        }
      ]

      function getAllMenuList(userMenuList, constantRoutes) {
        const res = []
        constantRoutes.forEach((item) => {
          if (item.children && item.children.length) {
            userMenuList.forEach((child) => {
              item.children.push(child)
            })
          }
          res.push(item)
        })
        return res
      }

      /*  function filterNoHidden(routes) {
        return routes.filter((item) => {
          if (item.hidden) {
            return false
          }
          if (item.children && item.children.length) {
            item.children = filterNoHidden(item.children)
          }
          return true
        })
      } */

      const res = getAllMenuList(userMenuList, constantRoutes)
      console.log(res)
    </script>
  </body>
</html>
